import React from 'react'
import * as action from "../action"
import {useDispatch,useSelector} from "react-redux"

function List({arr,lefttit,righttit}) {
    let dispatch = useDispatch()
    let store = useSelector((state)=>{
        return {
            ...state.homereducer
        }
    })
//   console.log(arr,lefttit,righttit);
   let rigthbtnfn = ()=>{
       if (righttit === "换一换") {
        dispatch(action.Boutiquelist())
       } else if (righttit === "more") {
            dispatch(action.Freedatalist("more"))
       }
   }
  return (
    <div>
        <header>
            <span>{lefttit}</span>
            <span onClick={rigthbtnfn}>{righttit}</span>
        </header>
        <main>
            {
                arr && arr.length ? arr.map((item,index)=>{
                    return <dl key={index}>
                        <dt>
                            <img src={item.img}></img>
                        </dt>
                        <dd>{item.tit}</dd>
                    </dl>
                }):""
            }
        </main>
    </div>
  )
}

export default List